.custom_car_number_input {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-around;
}

.custom_car_number_input .cell {
  width: 64rpx;
  height: 84rpx;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  font-size: 34rpx;
  border-radius: 10rpx;
  border: 1rpx solid #009afa;
  color: #333;
}

.custom_car_number_input .cell.focus {
  border: 1rpx solid #44BB55FF;
  box-shadow: 0rpx 0rpx 10rpx #44BB55FF;
}

.custom_car_number_input .cell .cursor {
  width: 2rpx;
  height: 30rpx;
  background-color: #0099ff;
  animation: flashing 1.2s infinite steps(1, start);
}

@keyframes flashing {

  0%,
  100% {
    background-color: #0099ff;
  }

  50% {
    background-color: transparent;
  }
}

.custom_car_number_input .cell.eco {
  background-color: rgba(54, 210, 146, .2);
}

.custom_car_number_input .cell.eco.focus {
  border-color: #36d292;
  box-shadow: 0rpx 0rpx 10rpx #36d292;
}

.custom_car_number_input .cell.eco .cursor {
  background-color: #36d292;
  animation: flashing-eco 1.2s infinite steps(1, start);
}

@keyframes flashing-eco {

  0%,
  100% {
    background-color: #36d292;
  }

  50% {
    background-color: transparent;
  }
}


.custom_keyboard {
  display: flex;
  flex-direction: column;
  border-top: 1rpx solid #e6e6e6;
  position: fixed;
  bottom: 0;
  left: 0;
  width: 100vw;
  transform: translateY(100%);
  transition: all .5s cubic-bezier(0, 1, 0.5, 1);
}

.custom_keyboard.show {
  transform: translateY(0%);
}

.custom_keyboard.hide {
  transform: translateY(100%);
}

.custom_keyboard .toolbar {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: flex-end;
  padding: 15rpx 10rpx;
  color: #05aeff;
  background-color: #ffffff;
}

.custom_keyboard .keyboard {
  background-color: #d1d4db;
  display: flex;
  flex-direction: column;
  padding: 40rpx 10rpx;
}

.custom_keyboard .keyboard .row {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-around;
  margin-bottom: 20rpx;
}

.custom_keyboard .keyboard .row:last-child {
  margin-bottom: 0;
}

.custom_keyboard .keyboard .row .col {
  width: 65rpx;
  height: 84rpx;
  line-height: 84rpx;
  text-align: center;
  background-color: #ffffff;
  border-radius: 10rpx;
  margin-right: 15rpx;
  box-shadow: 0rpx 6rpx 5rpx #888888;
}

.custom_keyboard .keyboard .row .col:last-child {
  margin-right: 0;
}

.custom_keyboard .keyboard .row .col:active {
  box-shadow: 0rpx 0rpx 0rpx #888888;
}


.custom_keyboard .keyboard .row .col.disabled {
  color: #c6c6c8;
}

.custom_keyboard .keyboard .row .col.empty {
  background-color: transparent;
  box-shadow: unset;
}

.custom_keyboard .keyboard .row .col.backspace {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

.custom_keyboard .keyboard .row .col.backspace .icon {
  width: 42rpx;
  height: 28rpx;
}

.custom_keyboard .footer {
  height: env(safe-area-inset-bottom);
  background-color: #d1d4db;
}